import { Message } from 'element-ui'
import  router from '@/router/router'

export default {
	namespaced: true,
	state: {

		worktab: {
			// 标签列表,这里也可以默认为空
			list: [],
			// 用于tab组件中当前激活的标签
			current: {}
		},
		closingPage: ''
	},
	mutations: {
		// 关闭标签
		WORKTAB_REMOVE(state, closeTabName) {
			// 按路由的name属性，查找当前是否存在tab数据中，返回索引
			let index = state.worktab.list.findIndex(s => s.name === closeTabName)

			// 如果找到
			if (index > 0) {
				state.closingPage = state.worktab.list[index].name // 把当前关闭的标签名称，赋值到keep-alive的排除依据
				state.worktab.list.splice(index, 1) // 根据上面找到的索引，在tab数组中删除掉

				// 当关闭的是当前页的时候，激活别的标签
				if (closeTabName === state.worktab.current.name) {
					let _routeJump = (index == state.worktab.list.length) // 如果是最后一个
						? state.worktab.list[index - 1] // 返回splice截短后的最后一个tab信息
						: state.worktab.list[index] // 不然就返回splice截短后的原位置退出来的tab信息
					router.push(_routeJump)
				}
			} else {
				Message('第一个标签页不能关闭')
			}
		},
		// 增加标签页,路由切换时，会调用本方法，传的的参数是一个对象，
		WORKTAB_ROUTEADD(state, p) {
			if (p == '/') return
			// 根据传进来的路由参数（to、from）, 目标路由to的name,查找在tab列表中的索引
			let idx = state.worktab.list.findIndex(s => s.name === p.to.name)

			if (idx > -1) {
				// 如果要切换的目标，已经在tab数据列表中
				state.worktab.current = state.worktab.list[idx] // 取出来放到用于激活当前tab的变量中
			} else {
				state.worktab.list.push(p.to)// 标签不存在，现在新建
				state.worktab.current = p.to // 同时放到用于激活当前tab的变量中
			}
			state.closingPage = '' // 增加tab的时候，keep-alive缓存排除应该清空
		},
		// 关闭所有tab
		WORKTAB_REMOVEALL(state) {
			let firstRouter = state.worktab.list[0] // 第一个标签数据中的路由信息
			let curTablength = state.worktab.list.length  // 当前路由标签长度
			state.worktab.list.splice(1, curTablength - 1) // 截短tab项目数组到1个
			state.worktab.current = firstRouter
			router.push(firstRouter)
		},
		// 退出时清空tab信息
		WORKTAB_EXITLOGIN(state) {
			state.worktab.current = {}
			state.worktab.list = []
		}
	},
	actions: {
		WORKTAB_REMOVE({ commit }, p) {
			commit('WORKTAB_REMOVE', p)
		},
		WORKTAB_ROUTEADD({ commit }, p) {
			commit('WORKTAB_ROUTEADD', p)
		},
	}
}
